/** @jsxImportSource @emotion/react */
import {
  CCell, Cell, InputLine, LineColumn, SuffixInput, Table, TableBody, TableHead, TableRow, Text
} from "customize-easy-ui-component";
import * as React from "react";
import {InspectRecordLayout, InternalItemProps, RepLink, SelectInput, useItemInputControl} from "../../common/base";
import {calcAverageArrObj, floatInterception, tableSetInp} from "../../../common/tool";
import {useMeasureInpFilter} from "../../common/hooks";
import {检查结论选} from "../../tools";

export const tail架倾斜= <Text css={{"@media print": {fontSize: '0.875rem'}}}>
  注：仅在叉车额定起重量＞10000kg时需测，在标准载荷状态下测定。
</Text>;
export const itemA架倾斜= ['架倾斜表','架倾斜v','架倾斜r' ] as string[];
export const PortalTilt=
    React.forwardRef((
        { children, show ,alone=true,redId,nestMd,label,}:InternalItemProps,  ref
    ) => {
      const [getInpFilter]=useMeasureInpFilter(null,itemA架倾斜,);
      const {inp, setInp} = useItemInputControl({ ref });
      const avSpee=calcAverageArrObj(inp?.架倾斜表,(row)=>(row?.l ??'')/row?.t, 1,3);
      return <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show} redId={redId}
                                  nestMd={nestMd} alone={alone} label={label!}>
        <Text variant="h5">{label}：</Text>
        前顷速度（°/ s）, 要求值: ≤（ 8 ）°/s;
        <LineColumn column={8}>
          {(new Array(3).fill(null)).map((_,t:number) => {
            return <React.Fragment key={t}>
              <InputLine  label={`${t+1}次测量角度`}>
                <SuffixInput  value={inp?.架倾斜表?.[t]?.l || ''}
                              onChange={e =>{
                                tableSetInp('架倾斜表', t, inp, setInp, 'l', e.currentTarget.value || undefined);
                              }}>°</SuffixInput>
              </InputLine>
              <InputLine  label={`${t+1}次测量时间`}>
                <SuffixInput  value={inp?.架倾斜表?.[t]?.t || ''}
                              onChange={e => tableSetInp('架倾斜表', t, inp, setInp, 't', e.currentTarget.value || undefined)}>s</SuffixInput>
              </InputLine>
            </React.Fragment>;
          })}
        </LineColumn>
        <LineColumn column={6}>
          <div css={{margin: 'auto'}}>平均值 = {avSpee} （°/ s）</div>
          <InputLine  label='测定结果' >
            <SuffixInput  value={inp?.架倾斜v ||''}
                          onChange={e=>setInp({ ...inp, 架倾斜v: e.currentTarget.value||undefined})}>°/s</SuffixInput>
          </InputLine>
          <InputLine label='结论判定'>
            <SelectInput value={inp?.架倾斜r || ''} list={检查结论选}
                         onChange={e=>setInp({ ...inp, 架倾斜r: e.currentTarget.value||undefined})}/>
          </InputLine>
        </LineColumn>
        {tail架倾斜}
      </InspectRecordLayout>;
});
//附表4 门架（或货叉架）倾斜
export const PortalTiltVw= ({ orc, rep,label,} : { orc: any, rep: any,label:string}
) => {
  const avSpee=calcAverageArrObj(orc?.架倾斜表,(row)=>(row?.l ??'')/row?.t, 1,3);
  return <>
    <Text id='PortalTilt' variant="h4" css={{marginTop: '1rem',
    }}>{label}</Text>
    <Table fixed={ ["4.2%","15%","16%","17%","22%","14%","%"] }  css={ {borderCollapse: 'collapse' } } tight  miniw={800}>
      <TableHead>
        <TableRow>
          <CCell rowSpan={2}>序号</CCell><CCell rowSpan={2}>测量时间(s)</CCell><CCell rowSpan={2}>测量角度(°)</CCell>
          <CCell colSpan={3}>前顷速度（°/ s）</CCell><CCell rowSpan={2}>结果判定</CCell>
        </TableRow>
        <TableRow>
          <CCell>测量值</CCell><CCell>要求值</CCell><CCell>测定结果</CCell>
        </TableRow>
      </TableHead>
      <TableBody>
        <RepLink ori rep={rep} tag={'PortalTilt'}>
          {(new Array(3).fill(null)).map((_,t:number) => {
            let dvdrs1= Number(orc?.架倾斜表?.[t]?.l || '') / Number(orc?.架倾斜表?.[t]?.t || '');
            const ospv1=isFinite(dvdrs1)? floatInterception(dvdrs1, 1) :'';
            return <TableRow key={t}>
              <CCell>{t+1}</CCell><CCell>{orc?.架倾斜表?.[t]?.t}</CCell><CCell>{orc?.架倾斜表?.[t]?.l}</CCell>
              <CCell>{ospv1}</CCell>
              {0===t && <><CCell rowSpan={4}>≤（ 8 ）°/s</CCell>
                  <CCell rowSpan={4}>{orc?.架倾斜v}</CCell><CCell rowSpan={4}>{orc?.架倾斜r}</CCell>
              </>}
            </TableRow>;
          })}
          <TableRow>
            <CCell colSpan={3}>平均值</CCell><CCell>{avSpee}</CCell>
          </TableRow>
          <TableRow>
            <Cell colSpan={7} css={{whiteSpace: 'pre-wrap'}}>{tail架倾斜}</Cell>
          </TableRow>
        </RepLink>
      </TableBody>
    </Table>
  </>;
};
